<template>
  <div class="CommonProblem">
    <assets-head :title="serviceTerm ? $t('服务条款') : $t('关于我们')" />
    <div class="CommonProblem-padding">
      <p class="textColor" v-html="content"></p>
    </div>
  </div>
</template>
<script>
import assetsHead from "@/components/assets-head";
import Axios from "@/API/userCenter.js";
import { dataTimeEx } from '@/utils/utis'
export default {
  data() {
    return {
      content: '',
      title: '',
      createTime: '',
      serviceTerm: '',
      dataTimeEx
    }
  },
  components: {
    assetsHead
  },
  mounted() {
    this.serviceTerm = this.$route.query.serviceTerm
    this.getCms();
  },
  methods: {
    onClickLeft() {
      this.$router.push('/')
    },
    getCms() {
      let language
      if (this.$i18n.locale == 'zh-CN' || this.$i18n.locale == 'CN') {
        language = this.$i18n.locale
      } else {
        language = 'en'
      }
      Axios.getCms({
        content_code: this.serviceTerm ? '001' : '020',
        language: this.serviceTerm ? language : this.$i18n.locale,
      }).then((res) => {
        this.content = res.data.content
        this.title = res.data.title
        this.createTime = this.dataTimeEx(res.data.createTime)

      }).catch((error) => {
        if (error.code == 'ECONNABORTED') { this.$toast(this.$t('网络超时！')); }
        else if (error.msg !== undefined) { this.$toast(this.$t(error.msg)); }
      });
    }
  }
}
</script>
<style lang="scss" >
.CommonProblem {
  width: 100%;
  box-sizing: border-box;
}

pre {
  white-space: pre-wrap;
}

.CommonProblem-padding {
  padding-left: 35px;
  padding-right: 35px;
  font-weight: 400;
  font-size: 30px;
  line-height: 35px;

  @include themify() {
    color: themed("text_color");
  }
}

.CommonProblem-title {
  font-style: normal;
  font-weight: 700;
  font-size: 50px;
  line-height: 59px;

  /* identical to box height */
  @include themify() {
    color: themed("text_color");
  }

  padding-left: 35px;
  padding-right: 35px;
  margin-top: 57px;
  margin-bottom: 22px;
}
</style>
